// 收款核算
<template>
  <div>
    <el-dialog title="收款核销" :visible.sync="dialogShow" width="90%" :close-on-click-modal="false" :close-on-press-escape="false">
      <el-table class="new-table-style bold-scrollbar-table cost-box bold-scrollbar-table" :border="true" :data="tableData" align="left">
        <el-table-column align="center" label="序号">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column align="left" label="客户" width="130" prop="customerName"></el-table-column>
        <el-table-column align="left" label="费项名称" width="130" prop="bizTypeName"></el-table-column>
        <el-table-column align="left" label="资产编号" width="130" prop="chargeItemCode"></el-table-column>
        <el-table-column align="center" label="应缴日期" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.paymentDeadline | formatDateTime('YYYY-MM-DD') }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="计费开始日期" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.cycleStartTime | formatDateTime('YYYY-MM-DD') }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="计费结束日期" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.cycleEndTime | formatDateTime('YYYY-MM-DD') }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="总金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.amountReceivable | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="未结金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.unPaymentAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="本次核销金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <el-input-number :controls="false" :min="0" class="no-border-input" v-model="scope.row.writeOffAmount" @blur="triggerAmount(scope.row)"  placeholder="请输入"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column align="center" label="不含税金额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ (accSubtr(scope.row.amountReceivable, scope.row.taxAmount) || 0) | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="税额" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <span>{{ scope.row.taxAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作" class-name="no-padding" min-width="120">
          <template slot-scope="scope">
            <el-button type="text" class="color-red" @click="deleteFn(scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <div class="font-size-17 font-weight-700 padding-top-40 padding-bottom-20">收款信息</div>
      <form-common :filed-list="formList" ref="form" :formObj="formObj"></form-common>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogShow = false" class="el-button-reset">取 消</el-button>
        <el-button type="primary" @click="confirmFn">保 存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { gatherAdjustList } from '../../../assets/form';
  import formCommon from '@g/components/form/formCommon.vue';
  import { apiReceivableWriteOff } from '../../../api/billManage';
  import { accSubtr, requestTips } from '@/common/js/utils.js';
  import $ from 'jquery';

  export default {
    name: 'gatherAdjust',

    props: {
      options: {
        type: Object,
        default: () => {
          return {};
        },
      },
      checkList: {
        type: Array,
        default: () => {
          return [];
        },
      },
    },

    watch: {
      options: {
        deep: true,
        handler(val) {
          this.setSelectOptions();
        },
      },
    },

    data() {
      return {
        dialogShow: false,
        formList: gatherAdjustList,
        formObj: {},
        tableData: [],
        accSubtr: accSubtr,
        userInfo: JSON.parse(localStorage.getItem('userInfo')),
      };
    },

    methods: {
      init() {
        this.dialogShow = true;
        this.tableData = this.checkList;
        this.initFormData();
      },

      initFormData() {
        this.$set(this.formObj, 'chargeUserName', this.userInfo.nickname);
        this.$set(this.formObj, 'clientName', this.tableData[0].customerName);
      },

      deleteFn(index) {
        this.tableData.splice(index, 1);
      },

      //收款核销收款金额>=0才能提交
      async confirmFn() {
        if (this.tableData.length == 0) {
          this.$message.warning('账单为空！！');
          return;
        }

        let model = this.$refs.form.validateForm(); //基本信息
        if (!model) return;

        let validateMustCost = this.validateMustCost();
        if (!validateMustCost) {
          this.$message.warning('每笔账单核销金额不能为空！');
          return;
        }

        this.tableData.forEach(item => {
          item.billKey = item.primaryKey;
        });
        model.itemList = this.tableData;
        let res = await apiReceivableWriteOff(model);
        requestTips(res, () => {
          this.dialogShow = false;
          this.$emit('confirmGatherAdjust');
        });
      },

      //校验 计算收款金额
      triggerAmount(row) {
        if (row.writeOffAmount > row.unPaymentAmount) {
          row.writeOffAmount = row.unPaymentAmount;
        }
        let price = this.getAllAmount();
        this.formObj = this.$refs.form.returnModel()
        this.$set(this.formObj, 'receivedAmount', price);
      },

      //计算收款金额
      getAllAmount() {
        let num = this.tableData.reduce((prev, item) => {
          prev += item.writeOffAmount || 0;
          return prev;
        }, 0);
        return num || 0;
      },

      //校验合同费用约定的必填
      validateMustCost() {
        for (let i = 0, len = $('.cost-box').find('.el-input__inner').length; i < len; i++) {
          let item = $('.cost-box').find('.el-input__inner')[i];
          if ($(item).val() == '') {
            $(item).css('border', '1px solid red');
            return false;
          } else {
            $(item).css('border', 'none');
          }
        }
        return true;
      },

      //赋值下拉框数据源
      setSelectOptions() {
        this.formList.forEach(ele => {
          if (ele.bindFieldName == 'paymentMethod') {
            ele.optionList = this.options.paymentMethodList || [];
          }
        });
      },
    },

    components: { formCommon },
  };
</script>

<style lang="scss" scoped></style>
